/* 
 * scaleWindow, ballAnimte for banner
 * 
 */

//var scaleWindow = function() {
function scaleWindow(){
    var windowWidth = $(window).width();
    //var windowHeight = $(window).height();
    var minWidth = 1000;
    var defaultWidth = 1222;
    var defaultHeight = 458;
    if(windowWidth>=minWidth){
        $scaleValue = windowWidth/defaultWidth;
    }
    else{
        $scaleValue = minWidth/defaultWidth;
    }
                
    $('.am_banner').css({
        'transform': 'scale(' + $scaleValue + ')',
        '-moz-transform': 'scale(' + $scaleValue + ')',
        '-webkit-transform': 'scale(' + $scaleValue + ')'
    });
    $('.am_banner_wrapper').css({
        'height': defaultHeight * $scaleValue
    });
                
};
            
// css for banner-item
function cssForItems(){
                
}
function ballAnimte(){
    var canvas = document.getElementById('am_canvas_light'),
    context = canvas.getContext('2d'),
    ball = new Ball(50, "#eb8384"),
    vx = Math.random() * 10 - 5,
    vy = Math.random() * 10 - 5;

    ball.x = canvas.width / 2;
    ball.y = canvas.height / 2;

    (function drawFrame () {
        window.requestAnimationFrame(drawFrame, canvas);
        context.clearRect(0, 0, canvas.width, canvas.height);

        var left = 0,
        right = canvas.width,
        top = 0,
        bottom = canvas.height;

        ball.x += vx;
        ball.y += vy;

        if (ball.x + ball.radius > right) {
            ball.x = right - ball.radius;
            vx *= -1;
        } else if (ball.x - ball.radius < left) {
            ball.x = left + ball.radius;
            vx *= -1;
        }
        if (ball.y + ball.radius > bottom) {
            ball.y = bottom - ball.radius;
            vy *= -1;
        } else if (ball.y - ball.radius < top) {
            ball.y = top + ball.radius;
            vy *= -1;
        }
        ball.draw(context);
    }());
}

//------------------------- mask
function head(){
    if(window.SVGForeignObjectElement){
        document.write('\
                                <svg width="1222px" height="458px">\
                                        <defs>\
                                                <mask id="mask" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse">\
                                                        <image width="1222px" height="458px" xlink:href="images/mask_grid.png"/>\
                                                </mask>\
                                        </defs>\
                                        <foreignObject width="100%" height="100%" style="mask: url(#mask);">\
                        ');
    }
    else{
        document.write('\
                                <div style="width: 1222px; height: 458px; filter: progid:DXImageTransform.Microsoft.Chroma(color=\'#00FFFF\'); zoom:1;">\
                        ');
    }
}
function foot(){
    if(window.SVGForeignObjectElement){
        document.write('\
                                        </foreignObject>\
                                </svg>\
                        ');
    }
    else{
        document.write('\
                                        <!--[if lte IE 9]>\
                                        <img src="images\\mask-grid-ie.png" style="display: block; margin-top: -458px;">\
                                        <![endif]-->\
                                </div>\
                        ');
    }
}